// 分装一个请求工具
// 1.创建一个新的axios实例
// 2.请求的拦截器，请求如果有token进行头部携带
// 3.相应拦截器  
// 3-1.剥离无效数据，获取有效数据
// 3-2.处理token失效
// 4.导出一个函数，调用当前的axios实例发请求，返回值promise



import axios from 'axios'
import store from '@/store'
// 导入router实现跳转
import router from '@/router'


// 1.创建一个新的axios实例
// 导出基准地址，原因：其他地方不是通过axios发请求的地方用上基准地址 如：图片上传
export const baseURL = 'http://pcapi-xiaotuxian-front-devtest.itheima.net/'
const instance = axios.create({
    // axios 的一些配置，baseURL  timeout
    // 设置基准路径
    // 配置请求的基准URL地址
    baseURL,
    // 过期时间
    timeout: 5000
})


// 2.请求的拦截器，请求如果有token进行头部携带
// instance是上面新建的实例对象（axios）
instance.interceptors.request.use(config => {
    // 响应正确
    // 拦截业务逻辑
    // 进行请求配置修改
    // 如果本地有token   就在请求头中携带token
    // 1.获取用户信息对象
    const { profile } = store.state.user
        // 2. 判断是否有token
        // console.log(profile.token);
    if (profile.token) {
        // 3. 设置响应头token
        config.headers.Authorization = `Bearer ${profile.token}`
    }
    return config
}, err => {
    // 响应错误
    return Promise.reject(err)
})

// 3.相应拦截器
//axios设置响应拦截器
// res => res.data  取出data数据，将来调用接口的时候直接拿到的就是后台的数据
instance.interceptors.response.use(res => res.data, err => {
    // 401 状态码，进入该函数
    // err.response && ...是为了排除无响应
    if (err.response && err.response.status === 401) {
        // 1.清空无效用户信息
        // store.commit('模块名/方法名', xxx);
        store.commit('user/setUser', {})
            // 2.跳转到登陆页面
        router.push('/login');
        // 3.跳转页面的时候需要传递参数(当前的路由地址)给登录页面
        // 当前路由地址
        // 组件里面：路径：'/user?a=10'   方法1：$route.path==='/user'  方法2：$route.fullPath==='/user?a=10'
        //js模块里 route.currentRoute.value.fullPath  获取当前的路由地址，route.currentRoute 是 ref响应式数据
        // encodeURIComponent转换url编码  防止解析地址出错
        // 因为他会把&（特殊字符）后面的抛弃
        // 这个是不是必须要大写， 小写报错
        const fullPath = encodeURIComponent(router.currentRoute.value.fullPath)
            // decodeURIComponent('转换后的url编码')，可以解析原来的编码
        router.push('/login?redirectUrl=' + fullPath)
    }
    return Promise.reject(err)
})


// 请求工具函数
export default (url, method, submitData) => {
    // 负责发请求：请求地址，请求方式，提交的数据
    return instance({
        url,
        method,
        // 1. 如果是get请求  需要使用params来传递submitData   ?a=10&c=10
        // 2. 如果不是get请求  需要使用data来传递submitData   请求体传参
        // [] 设置一个动态的key, 写js表达式，js表达式的执行结果当作KEY
        // method参数：get,Get,GET  转换成小写再来判断
        // 在对象，['params']:submitData ===== params:submitData 这样理解
        [method.toLowerCase() === 'get' ? 'params' : 'data']: submitData
    })
}